
Math.randomString = function(n) {
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

    for (var i = 0; i < n; i++)
        text += possible.charAt(Math.floor(Math.random() * possible.length));

    return text;
};
var rmsBox = rmsBox || {};
(function(){
        
    var rmsBoxNotify = function(type, options) {
        this.$type;
        this.$options;
        this.$el;
        var me = this;
        
        var _processInput = function(options){
            
            options = $.extend({}, rmsBox.notify.OPTIONS[me.$type], rmsBox.notify.DEFAULTS, options);
            if (options.icon === true){
                options.icon = rmsBox.notify.OPTIONS[me.$type].icon;
            }
            
            return options;
        };
        var _init = function(){
            // Create notification
            var notify = _createNotify();
            var wrapper = _createNotifyWrapper();
            _appendInWrapper(notify, wrapper);
            
            me.$el = notify;
            me.$el.data('rmsBox', me);
        };
        var _appendInWrapper = function($el, $wrapper){
            $wrapper.append($el);
        };
        var _createNotifyWrapper = function(){
            var selector;
            selector = '.rmsBox-notify-wrapper';
            
            var classes = me.$options.position.split(" ");
            selector += "."+classes.join('.');
            var wrapper = $(selector);
            if (wrapper.length === 0){
                wrapper = $('<div></div>')
                        .addClass(selector.replace(/\./g, ' ').trim())
                        .appendTo($('body'));
            }
            return wrapper;
        };
        var _createNotify = function(){
            var notify = $('<div class="rmsBox-notify"></div>')
                    .addClass(rmsBox.notify.OPTIONS[me.$type]['class'])
                    .addClass(rmsBox.notify.OPTIONS['class'])
                    .addClass(me.$options.showClass);
            
            var iconWrapper = $('<div class="rmsBox-notify-icon"></div>').appendTo(notify);

            // 添加字体图标
            if (me.$options.icon) {
                var icon = iconWrapper.append('<i class="' + me.$options.icon + '"></i>');
                iconWrapper.append(icon);
            }else{
                notify.addClass('without-icon');
            }
            // 创建提示框body
            var $body = $('<div></div>')
                    .addClass('rmsBox-notify-body')
                    .append('<div class="rmsBox-notify-msg">' + me.$options.msg + '</div>')
                    .appendTo(notify);
            _addCloseButton(notify);
            _addCloseOnClick(notify);
            _addDelay(notify);
            
            // 给提示框附宽度
            if (me.$options.width){
                notify.css('width', _calculateWidth(me.$options.width));
            }
            
            return notify;
        };
        var _addCloseButton = function($el){
            if ( ! me.$options.closable){
                return;
            }
            var close = $('<span class="rmsBox-close">&times;</span>');
            $el.append(close);
            close.click(function(ev){
                me.remove();
            });
        };
        var _addCloseOnClick = function($el){
            if ( ! me.$options.closeOnClick){
                return;
            }
            $el.click(function(){
                me.remove();
            });
        };
        var _addDelay = function($el){
            if ( ! me.$options.delay){
                return;
            }
            if (me.$options.delayIndicator){
                var delay = $('<div class="rmsBox-delay-indicator"><div></div></div>');
                $el.append(delay);
            }
            var time = 0;
            var interval = 1000/30;
            var timer = setInterval(function(){
                time += interval;
                var width = 100 * time / me.$options.delay;
                if (width >= 100){
                    width = 100;
                    me.remove();
                    timer = clearInterval(timer);
                }
                if (me.$options.delayIndicator){
                    delay.find('div').css('width', width+"%");
                }
               
            }, interval);
        };
        var _calculateWidth = function(width){
            width = Math.min($(window).outerWidth(), width);
            return width;
        };
        
        
        /**
         * 删除提示框
         */
        this.remove = function(){
            me.$el.removeClass(me.$options.showClass)
                    .addClass(me.$options.hideClass);
            setTimeout(function(){
                me.$el.remove();
            }, 500);
            return me;
        };
        this.$type = type;
        this.$options = _processInput(options);
        _init();
    };
    
    rmsBox.notify = function(type, options){
        if (["info", "warning", "error", "success"].indexOf(type) > -1){
            return new rmsBoxNotify(type, options);
        }
    };
    
    /**
     * 提示框的默认属性
     */
    rmsBox.notify.DEFAULTS = {
        showClass: 'zoomIn',        // 动画展现方式.
        hideClass: 'zoomOut',       // 隐藏动画方式
        icon: true,                 // 显示字体图标
        msg: '',                    // 提示信息
        closable: true,             // 是否支持关闭
        delay: 1000,                // 自动关闭延迟
        delayIndicator: true,       // 是否显示计时指示器
        closeOnClick: true,         // 是否点击关闭
        width: "280",               // 提示框宽度
        position: "bottom right"    // 提示框位置: "top left", "top right", "bottom left", "bottom right"
    };
    
    /**
     * 4种提示框必须要有的属性
     */
    rmsBox.notify.OPTIONS = {
        'class': 'animated-fast',
        success: {
            'class': 'rmsBox-notify-success',
            'icon': 'glyphicon glyphicon-ok-sign'
        },
        error: {
            'class': 'rmsBox-notify-error',
            'icon': 'glyphicon glyphicon-remove-sign'
        },
        warning: {
            'class': 'rmsBox-notify-warning',
            'icon': 'glyphicon glyphicon-exclamation-sign'
        },
        info: {
            'class': 'rmsBox-notify-info',
            'icon': 'glyphicon glyphicon-info-sign'
        }
    };
})();


